<template>
	<div class="">
		<!--滚动内容 start-->
		<el-scrollbar class="app-container-scroll-bar">
			
			<listTpml :data="pageData" @onCommand="listCommand" ref="listTpml"></listTpml>
			
    </el-scrollbar>
    <!--滚动内容 end -->
		
		
		<!--弹窗内容 start-->
		<div class="app-output-window">
			
			
		</div>
		<!--弹窗内容 end-->
		
	</div>
</template>

<script>
import { ruleStatusFilter } from '@/filters/status/index';
import listTpml from "@/view/components/listTmpl"
import { apiUrls, updateAlarmRuleStatus, deleteAlarmRule } from "@/service/swagger/AlarmController";
export default {
	components: {
		listTpml,
	},
	data() {
		return {
			pageData: {
				pageTitle: "告警规则",
				filterOption: [
					{
						label: "类型", // label名
						paramsName: "monitorType", // 出参name值
						defaultValue: "", // 出参默认值
						componentsName: "gaojinguizeTypeSelect", // 组件名
					},
					{
						label: "状态", // label名
						paramsName: "status", // 出参name值
						defaultValue: "", // 出参默认值
						componentsName: "guizeStatusSelect", // 组件名
					}
				],
				// 列表table 设置
				listOption: {
					// 列表上部btn组
					listBtns: [{
						label: "新建规则",
						iconfont: "icon-folder-add",
						commandName: "addAlarmRule",
					}],
					// 列表api
					listApi: {
						url: apiUrls.pageAlarmRulesList,
						type: "POST"
					},
					// 表头设置
					header: [{
						label: "规则名称",
						width: "",
						propName: "name",
						align: "left",
					}, {
						label: "资源类型",
						width: "",
						propName: "monitorType",
						html: (row) => {
							if (row.monitorType == 0) {
								return `<span>主机</span>`
							} else {
								return `<span>容器</span>`
							}
						},
					}, {
						label: "通知频率",
						width: "150",
						propName: "noticeRate",
						html: (row) => {
							if (row.noticeRate == 1) {
								return `<span>每次告警触发</span>`
							} else if (row.noticeRate == 2) {
								return `<span>每隔一小时触发</span>`
							} else {
								return `<span>不通知</span>`
							}
						}
					},
					{
						label: "通知方式",
						width: "",
						propName: "noticeType",
						html: (row) => {
							if (row.noticeType == 1) {
								return `<span>邮件</span>`
							} else {
								return `<span>电话</span>`
							}
						},
					},
					{
						label: "通知对象",
						width: "",
						propName: "noticeLinkman",
					},
					{
						label: "状态",
						width: "",
						propName: "hostDesc",
						html: (row) => {
							return ruleStatusFilter(row.status)
						},
					}, {
						label: "操作",
						width: "180",
						btns: [{
							label: "禁用",
							commandName: "stoptGZ",
							show: (row) => {
								if (row.status == 0) {
									return false
								} else {
									return true
								}
							}
						},
						{
							label: "启用",
							commandName: "startGZ",
							show: (row) => {
								if (row.status == 0) {
									return true
								} else {
									return false
								}
							}
						},
						{
							label: "修改",
							commandName: "xiugaiGZ",
						},
						{
							label: "删除",
							commandName: "deleteGZ",
						}],
						btnGroups: []
					}]
				}
			}
		}
	},
	methods: {
		listCommand(command, row, index) {
			// console.log("列表进行了操作：", command,row,index );
			if (command && this[command]) {
				this[command](row, index);
			} else {
				this.$router.push({
					path: command
				})
			}
		},
		listLoaded() { },
		refresh() {
			this.$refs.listTpml.search();
		},
		// 新增规则
		addAlarmRule() {
			this.$router.push({
				path: "addGZ"
			})
		},
		// 禁用规则
		stoptGZ(row) {
			updateAlarmRuleStatus(row.id, 0).then(ret => {
				if (ret && ret.code == 0) {
					this.refresh()
					this.$message({ showClose: true, message: '操作成功', type: 'success' })
				} else {
					this.$message({ showClose: true, message: '操作失败', type: 'error' })
				}
			})
		},
		// 启动规则
		startGZ(row) {
			updateAlarmRuleStatus(row.id, 1).then(ret => {
				if (ret && ret.code == 0) {
					this.refresh()
					this.$message({ showClose: true, message: '操作成功', type: 'success' })
				} else {
					this.$message({ showClose: true, message: '操作失败', type: 'error' })
				}
			})
		},
		// 删除
		deleteGZ(row) {
			this.$confirm("此操作将永久删除该告警规则,是否继续?", "提示", {
				confirmButtonText: "确定",
				cancelButtonText: "取消",
				type: "waring"
			}).then(() => {
				deleteAlarmRule(row.id).then(ret => {
					if (ret && ret.code == 0) {
						this.refresh()
						this.$message({ showClose: true, message: '操作成功', type: 'success' })
					} else {
						this.$message({ showClose: true, message: '操作失败', type: 'error' })
					}
				})

			})

		},
		xiugaiGZ(row) {
			this.$router.push({
				path: 'xgGZ',
				query: {
					id: row.id
				}
			})
		},
		listLoaded() {

		},
	}
}
</script>

<style>
</style>